<template>
    <div class="row">
        <div class="col-12">
          <div class="tab-content right-content">
            <div class="tab-pane fade show active">
              <h3>{{title}}<small><br><br>时间:{{time}}&nbsp;&nbsp;&nbsp;浏览器次数:{{viewCount||0}}次</small></h3> 
                 <p v-html = 'content'></p>
            </div>
          </div>
        </div>
      </div>
</template>
<script>
import store from "@/store";
import { getArticleInfo, articleInfo } from "@/api/service";
import { fieldMap, publicFilter } from "@/utils/showMap";
export default {
  props: ["param"],
  data() {
    return { 
        title:'',
        content:'',
        viewCount:'',
        time:'',
    };
  },
  filters: {
    status: (value) => publicFilter(fieldMap.article_status, value.toString()),
    category: (value) => publicFilter(fieldMap.article_category, value.toString()),
  },
  mounted() {  
    if (this.param) this.search(this.param); 
  },
  methods: {
    search(args) {
      getArticleInfo(args).then((res) => {
          this.title=res.data.title;
          this.content=res.data.content;
          this.author=res.data.viewCount;
          this.time=res.data.createTime
      });
    } 
  },
};
</script>
<style lang="less" scoped>
.tab-content{a{color:#000;}} 
 .context_container {
      margin: 15px auto;
      font-size: 14px; 
      .right-content {
        border: 1px solid #f5f5f5;
        box-shadow: 1px 1px 10px 10px #f6f6f6; 
        >div {
          padding: 15px;
          min-height:500px;
          table,img{
              max-width:100%;
          }
        }  
      }
    }
</style>
